<!DOCTYPE html>
<html>
<head>

  <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <!-- 国产浏览器默认采用高速模式渲染页面 -->
    <meta name="renderer" content="webkit">
    <title>度假屋、民宿、体验和攻略 - Airbnb爱比迎</title>
    <!-- Bootstrap.css -->
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <!-- 字体图标 -->
    <link rel="stylesheet" href="css/font-awesome.css">
    <!-- 修复IE10的媒体查询bug -->
    <link rel="stylesheet" href="css/ie10-viewport-bug-workaround.css">
    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
      <script src="https://cdn.bootcss.com/html5shiv/3.7.3/html5shiv.min.js"></script>
      <script src="https://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->

    <!-- 标签页图标 -->
    <link rel="shortcut icon" href="img/favicon.ico" type="image/x-icon">
    <!-- 导航栏 -->
    <link rel="stylesheet" href="css/navigation-bar.css">
    <!-- 主体内容 -->
    <link rel="stylesheet" href="css/lds.css">
<title></title>
</head>
<body>
	<header>
		<div class="wjc-navigation">
			<!-- 爱彼迎的svg图标 -->
			<div class="wjc-navigation-icon">
				<svg viewBox="0 0 1000 1000" role="presentation" aria-hidden="true"
					focusable="false">
                    <path
						d="m499.3 736.7c-51-64-81-120.1-91-168.1-10-39-6-70 11-93 18-27 45-40 
                        80-40s62 13 80 40c17 23 21 54 11 93-11 49-41 105-91 168.1zm362.2 43c-7 47-39 
                        86-83 105-85 37-169.1-22-241.1-102 119.1-149.1 141.1-265.1 90-340.2-30-43-73-64-128.1-64-111 
                        0-172.1 94-148.1 203.1 14 59 51 126.1 110 201.1-37 41-72 70-103 88-24 13-47 
                        21-69 23-101 15-180.1-83-144.1-184.1 5-13 15-37 32-74l1-2c55-120.1 122.1-256.1 199.1-407.2l2-5 
                        22-42c17-31 24-45 51-62 13-8 29-12 47-12 36 0 64 21 76 38 6 9 13 21 22 36l21 41 3 6c77 151.1 144.1
                        287.1 199.1 407.2l1 1 20 46 12 29c9.2 23.1 11.2 46.1 8.2 
                        70.1zm46-90.1c-7-22-19-48-34-79v-1c-71-151.1-137.1-287.1-200.1-409.2l-4-6c-45-92-77-147.1-170.1-147.1-92 
                        0-131.1 64-171.1 147.1l-3 6c-63 122.1-129.1 258.1-200.1 409.2v2l-21 46c-8 19-12 29-13 32-51 
                        140.1 54 263.1 181.1 263.1 1 0 5 0 10-1h14c66-8 134.1-50 203.1-125.1 69 75 137.1 117.1 203.1 
                        125.1h14c5 1 9 1 10 1 127.1.1 232.1-123 181.1-263.1z">
                    </path>
                </svg>
			</div>

			<div class="wjc-navigation-other row">
				<!-- 搜索输入框 -->
				<div class="col-md-6">
					<form action="#" method="POST" class="form-inline" role="form">
						<div class="form-group">
							<div class="input-group">
								<div class="input-group-addon wjc-navgation-search-prev">
									<i class="fa fa-search" aria-hidden="true"></i>
								</div>
								<label class="sr-only" for="wjc-navgation-search">搜索</label> <input
									type="text" name="search" class="form-control"
									id="wjc-navgation-search" placeholder="搜索">
							</div>
						</div>
					</form>
				</div>

				<!-- 导航栏菜单 -->
				<nav class="col-md-6">
					<ul class="wjc-navigation-menu list-inline">
						<li class="dropdown"><a id="wjc-nav-currency" href="#"
							class="dropdown-toggle" data-toggle="dropdown" role="button"
							aria-haspopup="true" aria-expanded="false"> 人民币 - ￥ </a>
							<ul class="dropdown-menu my-nav-dropdown-menu1">
								<li class="my-nav-dropdown-menu1-title"><a href="#">常用货币</a></li>
								<li><a href="#">人民币 - ￥</a></li>
								<li><a href="#">美元 - $</a></li>
								<li><a href="#">日元 - ￥</a></li>
								<li><a href="#">港币 - $</a></li>
								<li><a href="#">新台币 - $</a></li>
								<li><a href="#">欧元 - $</a></li>
								<li><a href="#">英镑 - $</a></li>
								<li class="my-nav-dropdown-menu1-title"><a href="#">其他货币</a></li>
								<li><a href="#">澳大利亚元 - $</a></li>
							</ul></li>
						<li><a href="#" class="dropdown-toggle"
							data-toggle="dropdown" role="button" aria-haspopup="true"
							aria-expanded="false"> 手机端 </a>
							<div class="dropdown-menu my-nav-dropdown-menu2">
								<div>
									<img
										src="img/download_app_other-2216c06ab35e39238e40720ed9bf1439.png"
										alt="下载手机客户端">
									<div>下载手机客户端</div>
									<div>&nbsp;</div>
								</div>
								<div>
									<img
										src="img/service_account_qr_code_header_other-9291205a414d3af6b492e99d4a0b21e4.png"
										alt="关注微信服务号">
									<div>关注微信服务号</div>
									<div>id：AirbnbOfficial</div>
								</div>
							</div></li>
						<li class="show wjc-login-prev"><a href="#"
							class="dropdown-toggle" data-toggle="dropdown" role="button"
							aria-haspopup="true" aria-expanded="false">成为房东/体验达人</a>
							<div class="dropdown-menu my-nav-dropdown-menu3">
								<div>
									<div class="my-nav-dropdown-menu3-title">房源</div>
									<div class="wjc-flex-con1">
										<div>
											<div class="my-nav-dropdown-menu3-link">
												<a href="#">发布房源</a>
											</div>
											<div class="my-nav-dropdown-menu3-content">
												在<span class="wjc-nav-dropdown-loc">沈阳</span>接待房客，每月为您带来高达<span
													class="wjc-nav-dropdown-monthlyincome">￥5,627</span>的收入
											</div>
										</div>
										<div class="my-nav-dropdown-menu3-icon">
											<svg viewBox="0 0 24 24" role="presentation"
												aria-hidden="true" focusable="false"
												style="height: 24px; width: 24px; display: block; fill: currentcolor;">
                                                <path
													d="m23.06 11.4-1.75-1.76-3.85-3.87-3.85-3.87-1.27-1.27-.36-.36-.09-.09c-.23-.23-.55-.23-.75-.02l-1.68 
                                                    1.75-3.68 3.87-3.68 3.87-1.67 1.75a1.47 1.47 0 0 0 -.43 1.05v.02c.01.38.15.76.44 1.05l.55.55a1.49 1.49 0 
                                                    0 0 2.01.08v8.4c0 .81.68 1.45 1.5 1.45h14c .82 0 1.5-.65 1.5-1.45v-8.86l.38.38a1.5 1.5 0 0 0 
                                                    2.13-.01l.55-.55c.59-.59.59-1.54.01-2.13zm-4.06 11.15c0 .24-.22.45-.5.45h-14c-.28 0-.5-.21-.5-.45v-9.41l7.51-7.93 
                                                    7.49 7.48v9.85zm3.35-9.74-.55.55c-.2.2-.52.2-.71.01l-9.24-9.22a.5.5 0 0 0 -.72.01l-8.73 9.22a.5.5 0 
                                                    0 1 -.7-.02l-.55-.55a.5.5 0 0 1 -.01-.71l1.68-1.77 3.69-3.86 3.68-3.87 1.32-1.39c.03.03.07.07.12.12l1.27 
                                                    1.27 3.85 3.87 3.85 3.87 1.75 1.76a.51.51 0 0 1 -.01.71zm-10.85-.81a.5.5 0 0 1 .5.5v3.5h3.5a.5.5 0 1 1 0 
                                                    1h-3.5v3.5a.5.5 0 0 1 -1 0v-3.5h-3.5a.5.5 0 0 1 0-1h3.5v-3.5a.5.5 0 0 1 .5-.5z"
													fill-rule="evenodd"></path>
                                            </svg>
										</div>
									</div>
									<div class="my-nav-dropdown-menu3-link">
										<a href="#">了解如何出租您的房源</a>
									</div>
								</div>
								<hr>
								<div>
									<div class="my-nav-dropdown-menu3-title">体验</div>
									<div class="wjc-flex-con1">
										<div>
											<div class="my-nav-dropdown-menu3-link">
												<a href="#">开始体验</a>
											</div>
											<div class="my-nav-dropdown-menu3-content">带领别人做自己热爱的事并赚取收入</div>
										</div>
										<div class="my-nav-dropdown-menu3-icon">
											<img src="img/bb6d49e059b6c7d8791e9b4e30f8d4cd.svg"
												alt="开始体验">
										</div>
									</div>
								</div>
							</div></li>
						<li class="hidden wjc-login-after"><a href="#">添加房源</a></li>
						<li class="hidden wjc-login-after"><a href="#"
							class="dropdown-toggle" data-toggle="dropdown" role="button"
							aria-haspopup="true" aria-expanded="false">管理面板</a>
							<ul class="dropdown-menu my-nav-dropdown-menu4">
								<li><a href="#" class="my-nav-dropdown-menu4-title">添加新房源</a></li>
								<li><a href="#">
										<div class="wjc-flex-con1">
											<div>
												<span class="my-nav-dropdown-menu4-title">开展体验</span>
												<div>与房客分享您最喜爱的一项活动，赚取额外收入</div>
											</div>
											<div class="my-nav-dropdown-menu3-icon">
												<img src="img/bb6d49e059b6c7d8791e9b4e30f8d4cd.svg"
													alt="开始体验">
											</div>
										</div>
								</a></li>
							</ul></li>
						<li><a href="#">故事</a></li>
						<li class="hidden wjc-login-after"><a href="#">心愿单</a></li>
						<li class="hidden wjc-login-after"><a href="#">旅程</a></li>
						<li class="hidden wjc-login-after"><a href="#">消息</a></li>
						<li><a href="#">帮助</a></li>
						<li class="hidden wjc-login-after wjc-user-info"><a href="#"
							class="dropdown-toggle" data-toggle="dropdown" role="button"
							aria-haspopup="true" aria-expanded="false"> <img
								src="img/u=2378369412,2669061161&fm=173&app=25&f=JPEG.jpg"
								alt="头像" class="img-circle">
						</a>
							<ul class="dropdown-menu my-nav-dropdown-menu6">
								<li><a href="#">编辑个人资料</a></li>
								<li><a href="#">旅行资金</a></li>
								<li><a href="#">账号设置</a></li>
								<li><a href="#">我的指南</a></li>
								<li><a href="#">商务爱彼迎</a></li>
								<li id="wjc-login-out"><a href="#">退出</a></li>
							</ul></li>
						<li class="show wjc-login-prev"><a href="#">注册</a></li>
						<li class="show wjc-login-prev"><a href="#"
							data-toggle="modal" data-target="#myModal">登陆</a> <!-- 登陆的模态框 -->
							<div class="modal fade" id="myModal" tabindex="-1" role="dialog"
								aria-labelledby="myModalLabel">
								<div class="modal-dialog" role="document">
									<div class="modal-content">
										<div class="modal-header wjc-nav-login-modal-header">
											<button type="button" class="close" data-dismiss="modal"
												aria-label="Close">
												<span aria-hidden="true">&times;</span>
											</button>
											<h4 class="modal-title" id="myModalLabel">登陆爱彼迎</h4>
										</div>
										<div class="modal-body">
											<form action="#" method="post">
												<div class="form-group">
													<label class="sr-only" for="wjc-login-lname">电子邮件地址</label>
													<input type="text" name="lname" id="wjc-login-lname"
														class="form-control input-lg" placeholder="电子邮件地址">
												</div>
												<div class="form-group">
													<label class="sr-only" for="wjc-login-lpass">Password</label>
													<input type="password" name="lpass"
														class="form-control input-lg" id="wjc-login-lpass"
														placeholder="密码">
												</div>
												<div class="form-group">
													<div class="checkbox">
														<label> <input type="checkbox"> 记住我
														</label>
													</div>
												</div>
												<button type="button" id="wjc-btn-login"
													class="btn btn-success btn-lg btn-block">登陆</button>
											</form>
										</div>
										<div class="modal-footer wjc-nav-login-modal-footer">
											<span>还没有账号？</span>
											<button type="button" class="btn btn-danger"
												data-dismiss="modal">注册</button>
										</div>
									</div>
								</div>
							</div></li>
					</ul>
				</nav>
			</div>
	</header>
	<!-- JavaScript引用 -->
	<!-- JQuery.js -->
	<script src="js/jquery-3.3.1.min.js"></script>
	<!-- Bootstrap.js -->
	<script src="js/bootstrap.min.js"></script>
	<!-- 导航栏 -->
	<script src="js/navigation-bar.js"></script>
	<a name="lds_add"></a>
	<!-- 
	<div class="container-fluid" id="lds_succed">
		<div class="col-lg-11 ">
			<div class="col-lg-6 col-lg-offset-5">
				<i class="fa fa-commenting" aria-hidden="true"></i> 个人资料更新成功 <span
					style="margin-left: 10px;">|</span> <a> 前往控制面板</a>

			</div>
			<div class="clo-lg-1 col-lg-offset-12" id="lds_x"
				style="text-align: center; color: #4FB0BB; cursor: pointer;">x</div>
		</div>
	</div>
	 -->
	<div class="container">
		<div class="row" style="margin-top: 80px;">
			<div class="col-lg-3">
				<ul>
					<li><a class="lds_personal "
						style="color: #484848; font-weight: bolder;" href="index.html">编辑个人资料</a></li>
					<li><a class="lds_personal " href="zhaopian.html">照片</a></li>
					<li><a class="lds_personal lds_wu">信任和验证</a></li>
					<li><a class="lds_personal lds_wu">评价</a></li>
					<li><a class="lds_personal lds_wu">推荐语</a></li>
				</ul>
				<a id="lds_link2chunk">查看个人资料</a>
			</div>
			<form action="#">
				<div class="col-lg-9">
					<div class="col-lg-12" id="lds_diyi">
						<div class="col-lg-12" id="lds_xixi">
							<h3 id="lds_h3">必填</h3>
						</div>
						<div class="col-lg-12" id="lds_haha">
							<div class="col-lg-11 lds_hehe">
								<div class="col-lg-3 text-right lds_size" class="lds_size">
									姓名 <i class="fa fa-lock lds_tubiao" aria-hidden="true"></i>
								</div>
								<div class="col-lg-9">
									<input type="text" value="" class="lds_inp" id="uname" />
								</div>
							</div>
							<div class="col-lg-11 lds_hehe">
								<div class="col-lg-3 text-right lds_size" class="lds_size">
									账号 <i class="fa fa-lock lds_tubiao" aria-hidden="true"></i>
								</div>
								<div class="col-lg-9">
									<input type="text" value="${EL表达式}" class="lds_inp" id="lname" />
									<div class="text-muted space-top-1">您的公开个人资料将仅显示您的名字。申请预订时，房东会看到您的名字和姓氏。</div>
								</div>
							</div>
							<div class="col-lg-11 lds_hehe">
								<div class="col-lg-3 text-right lds_size" class="lds_size">
									我是 <i class="fa fa-lock lds_tubiao" aria-hidden="true"></i>
								</div>
								<div class="col-lg-9">
									<select id="sex">
										<option value="0">性别</option>
										<option value="1">男性</option>
										<option value="2">女性</option>
										<option value="3">其他</option>
									</select>
									<div class="text-muted space-top-1">此数据仅用于分析，我们不会透露给其它用户。</div>
								</div>
							</div>
							<div class="col-lg-11 lds_hehe">
								<div class="col-lg-3 text-right lds_size" class="lds_size">
									出生日期 <i class="fa fa-lock lds_tubiao" aria-hidden="true"></i>
								</div>
								<div class="col-lg-9">
									<input type="date" id="birthday"/>

									<div class="text-muted space-top-1">此数据将帮助我们更好地为您提供服务，除必要的内部使用外，我们不会将您的信息透露给房东或其他用户。您必须年满
										18 周岁才能使用爱彼迎的网站和服务。</div>
								</div>
							</div>
							4
							<div class="col-lg-11 lds_hehe">
								<div class="col-lg-3 text-right lds_size" class="lds_size">
									电子邮件地址 <i class="fa fa-lock lds_tubiao" aria-hidden="true"></i>
								</div>
								<div class="col-lg-9">
									<input type="text"  class="lds_inp" id="email" />
									<div class="text-muted space-top-1">
										我们不会向其他爱彼迎用户透露您的个人邮箱地址。 <a href="################"
											target="blank">了解更多</a>。
									</div>
								</div>
							</div>
							<div class="col-lg-11 lds_hehe">
								<div class="col-lg-3 text-right lds_size" class="lds_size">
									电话号码 <i class="fa fa-lock lds_tubiao" aria-hidden="true"></i>
								</div>
								<div class="col-lg-9">
									<input type="text" id="tel"  value=" " />
									<div class="text-muted">我们会给您发送预订申请、提醒以及其他事项的通知。</div>

								</div>
							</div>
							<div class="col-lg-11 lds_hehe">
								<div id="f_div" class="alert alert-danger alert-dismissible" role="alert" style="display:none">
								  <!-- <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button> -->
								  <span id="f_info"></span>
								</div>
							</div>
							<div class="col-lg-11 lds_hehe">
								<!-- <a href="#lds_x"></a> -->
								<button type="button" id="lds_endbutton">保存</button>
							</div>
						</div>
					</div>

				</div>
				
				
			</form>
		</div>
		
	</div>
	<script type="text/javascript" src="js/jquery-3.3.1.min.js" ></script>
	<script type="text/javascript" src="js/bootstrap.min.js" ></script>
	<script type="text/javascript" src="js/lds.js"></script>
	<script type="text/javascript">
		$(document).ready(function (){
			//获取用户的数据
		    $.ajax({
				url: "/airbnb/getMyUserinfo.do",
				async: false,
			   	type: "POST",
			   	error: function (){
			   		alert("ajax请求失败");
			   	},
			   	success: function(json){
			   		$("#uname").val(json.uname);
			   		$("#lname").val(json.lname);
			   		$("#sex").val(json.sex);
			   		$("#birthday").val(json.birthday);
			   		$("#email").val(json.email);
			   		$("#tel").val(json.tel);
			   	}
			});
			
			//设置保存按钮的点击事件
			$("#lds_endbutton").click(function (){
				//1.验证所有的表单框体（数据）是否都已输入
				var uname = $("#uname").val();
				var lname = $("#lname").val();
				var sex = $("#sex").val();
				var birthday = $("#birthday").val();
				var email = $("#email").val();
				var tel = $("#tel").val();
				$("#f_info").empty();
				$("#f_div").hide();
				$("#f_div").removeClass("alert-success");
		   		$("#f_div").addClass("alert-danger");
				if(uname == ""){
					$("#f_info").html("<strong>提示：</strong>请输入姓名");
					$("#f_div").show();
					return;
				}
				if(lname == ""){
					$("#f_info").html("<strong>提示：</strong>请输入账号");
					$("#f_div").show();
					return;
				}
				if(sex == "" || sex == 0 || sex == null){
					$("#f_info").html("<strong>提示：</strong>请选择性别");
					$("#f_div").show();
					return;
				}
				if(birthday == ""){
					$("#f_info").html("<strong>提示：</strong>请输入生日");
					$("#f_div").show();
					return;
				}
				if(email == ""){
					$("#f_info").html("<strong>提示：</strong>请输入邮箱");
					$("#f_div").show();
					return;
				}
				if(tel == ""){
					$("#f_info").html("<strong>提示：</strong>请输入电话");
					$("#f_div").show();
					return;
				}
				//2.验证账号，邮箱，电话号码的唯一性
				var res;
				$.ajax({
					url: "/airbnb/validateUser.do",
					async: false,
				   	type: "POST",
				   	data:{"lname":lname,"email":email,"tel":tel},
				   	error: function (){
				   		alert("ajax请求失败");
				   	},
				   	success: function(json){
				   		res = json;
				   	}
				});
				
				//alert(JSON.stringify(result));
				var lres = res.lres; //账号的验证结果
				var eres = res.eres; //邮箱的验证结果
				var tres = res.tres; //电话的验证结果
				if(lres != 1){
					$("#f_info").append("<strong>提示：</strong>账号已被他人占用<br>");
					$("#f_div").show();
				}
				if(eres != 1){
					$("#f_info").append("<strong>提示：</strong>邮箱已被他人占用<br>");
					$("#f_div").show();
				}
				if(tres != 1){
					$("#f_info").append("<strong>提示：</strong>电话已被他人占用<br>");
					$("#f_div").show();
				}
				//三者不都是1，验证未通过，不能继续保存数据
				if(lres + eres + tres < 3){	
					return;
				}
				//3.保存数据
				$.ajax({
					url: "/airbnb/updateUser.do",
					async: false,
				   	type: "POST",
				   	data:{"lname":lname,"email":email,"tel":tel,"uname":uname,"sex":sex,"birthday":birthday},
				   	error: function (){
				   		alert("ajax请求失败");
				   	},
				   	success: function(json){
				   		$("#f_div").removeClass("alert-danger");
				   		$("#f_div").addClass("alert-success");
				   		$("#f_info").html("<strong>提示：</strong>保存成功");
						$("#f_div").show();
				   	}
				});
				
				
				
			});
		});
	</script>
</body>
</html>
